@import 'common';

.top-story-container {
	display: flex;
	max-width: 1000px;
	width: 1000px;
	margin: auto;
	margin-top: 70px;
	.main-content {
		flex: 7;
		max-width: 680px;
		margin: 0 10px;
		.slider-container {
			margin-top: 10px;
			.slick-slide {
				width: 100%;
				height: 300px;
				img {
					width: 100%;
					height: auto;
					display: block;
				}
			}
		}
		.feed-container {
			box-sizing: border-box;
		}
	}
	.right-area {
		flex: 3;
		max-width: 280px;
		margin: 10px;
		.recommend-container {
			margin-top: 0;
			.recommend-content {
				padding: 5px 20px 20px;
				font-size: 15px;
				width: 100%;
				.recomment-item {
					padding-left: 20px;
					.anticon-star {
						margin-left: -20px;
					}
				}
				.anticon-star,
				a:hover {
					color: map-get($defaultColor, c7);
				}
				&.no-data {
					text-align: center;
					line-height: 120px;
				}
				&.has-data {
					line-height: 30px;
				}
			}
		}
		.title {
			text-align: center;
			margin-top: 10px;
		}
		.footer-container {
			& > ul {
				li {
					line-height: 25px;
				}
			}
			.list {
				li {
					display: inline-block;
					margin-right: 10px;
				}
			}
		}
	}
}